<template>
  <div id="member-address-list-page"
       v-loading="isLoading"
       element-loading-text="拼命加载中"
       element-loading-spinner="el-icon-loading"
       element-loading-background="rgba(0, 0, 0, 0.8)"
       :style="{
    width:'100%',
    height: (this.getWinSize().height-43-this.getSafeArea().top)+'px',
    paddingTop:(43+this.getSafeArea().top)+'px'
  }">
    <div class="page-title" :style="{
      top:(this.getSafeArea().top)+'px'
    }">
      <div id="back-button" @click="$router.push('/MemberHome')">
        <i href="javascript:void(0)" class="el-icon-arrow-left"></i>
      </div>
      <span>地址管理</span>
      <el-button icon="el-icon-plus" type="success" @click="createOrUpdate('create')" style="position: absolute; right: 5px; top: 8px;">新增</el-button>
    </div>

    <!--地址列表-->
    <div class="address-list" v-if="!isLoading">
      <address-item v-for="(address,key) in addressList" :key="key" :addressData="address" :show-type="1" :from="from" :call-back="getList"/>
    </div>


  </div>
</template>

<script>
import AddressItem from "../common/AddressItem";
export default {
  name: "MemberAddressList",
  components: {AddressItem},
  mounted() {
    if (this.$route.query.from==='chooseAddress'){
      this.showType=2
      this.from='chooseAddress'
    }
    this.getList()
  },
  data:function () {
    return {
      isLoading:false,
      from:'',
      showType:0,
      addressList:[]
    }
  },
  methods:{
    // 获取-地址列表
    getList:function () {
      let $this=this
      $this.isLoading=true
      $this.MyRequest($this.ApiDoNameShop+'ShopAddress/getList', {}, function (data) {
        $this.isLoading=false
        $this.addressList=data
        $this.$forceUpdate()
      }, function (msg) {
        $this.isLoading=false
        $this.$message.error(msg)
        // $this.form.password = ''
      })
    },
    // 创建/更新-地址
    createOrUpdate:function (type) {
      var queryParams={type:type}
      if (this.$route.query.from){
        queryParams.from=this.$route.query.from
      }
      this.$router.push({name:'MemberAddressForm',query:queryParams})
    }
  }
}
</script>

<style scoped>

</style>
